<template>
    <div class="section-wrap">
        <div class="form-section">
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>单位名称</label>
                </div>
                <div>
                    <input type="text"
                           v-model="param.ProjectName"
                           disabled/>
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>地址
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <input type="text"
                           v-model="param.Address"
                           maxlength="150"
                           placeholder="请输入"
                           :disabled='isdisable' />
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>事故名称
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <input type="text"
                           v-model="param.AccidentName"
                           maxlength="25"
                           placeholder="请输入"
                           :disabled='isdisable' />
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>事故发生时间
                        <span class="red">*</span>
                    </label>
                </div>
                <div v-if="this.$route.query.urltype =='1'">
                    <p>{{param.AccidentDate.split(' ')[0]}}</p>
                </div>
                <group v-else>
                    <datetime :end-date=maxdate
                              v-model="param.AccidentDate"></datetime>
                </group>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>事故发生地点
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <input type="text"
                           v-model="param.AccidentPlace"
                           :disabled='isdisable'
                           maxlength="150"
                           placeholder="请输入" />
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>事故类别
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div v-if="this.$route.query.urltype =='1'">
                    <p>{{param.AccidentTypeName}}</p>
                </div>
                <group v-else>
                    <popup-picker :data="list2"
                                  :columns="1"
                                  v-model="troubletypedata"
                                  placeholder='请选择'></popup-picker>
                </group>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>事故等级
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div v-if="this.$route.query.urltype =='1'">
                    <p>{{param.AccidentLevel}}</p>
                </div>
                <group v-else>
                    <popup-picker :data="list1"
                                  :columns="1"
                                  v-model="troublelevel"
                                  placeholder='请选择'></popup-picker>
                </group>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>死亡人数
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <input type="number"
                           onkeyup="this.value=this.value.replace(/\D/g,'')"
                           onafterpaste="this.value=this.value.replace(/\D/g,'')"
                           v-model="param.DieNumber"
                           :disabled='isdisable'
                           placeholder="请输入（单位/人）" />
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>重伤人数
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <input type="number"
                           onkeyup="this.value=this.value.replace(/\D/g,'')"
                           onafterpaste="this.value=this.value.replace(/\D/g,'')"
                           v-model="param.BigNumber"
                           :disabled='isdisable'
                           placeholder="请输入（单位/人）" />
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>失踪人数
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <input type="number"
                           onkeyup="this.value=this.value.replace(/\D/g,'')"
                           onafterpaste="this.value=this.value.replace(/\D/g,'')"
                           v-model="param.SlightNumber"
                           :disabled='isdisable'
                           placeholder="请输入（单位/人）" />
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>事故原因
                        <span class="red">*</span>
                    </label>
                </div>
                <div v-if="this.$route.query.urltype =='1'">
                    <p>{{param.AccidentReasonName}}</p>
                </div>
                <group v-else>
                    <popup-picker :data="list3"
                                  :columns="1"
                                  v-model="reasondata"
                                  placeholder='请选择'></popup-picker>
                </group>
            </div>
            <div class="form-item form-item-style2">
                <div class="label-title space-between">
                    <div class="space-between">
                        <label>事故的经过和初步原因分析
                            <span class="red">*</span>
                        </label>
                    </div>
                    <span @click="unfoldMeasure = !unfoldMeasure">{{unfoldMeasure?'收起': '展开'}}</span>
                </div>
                <div>
                    <p class="textarea"
                       :class="{'unfold':unfoldMeasure}">{{param.AccidentReason}}</p>
                </div>
            </div>

            <div class="form-item form-item-style2">
                <div class="label-title">
                    <label>发生事故的有关情况
                        <span class="red">*</span>
                    </label>
                    <i class="iconfont"></i>
                </div>
                <div>
                    <p class="textarea">{{param.simple}}</p>
                    <!-- <textarea v-else
                              placeholder="请输入（自行换行）"
                              v-model="param.simple"
                              :disabled='isdisable'
                              maxlength="300"></textarea> -->
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>人员伤亡情况
                        <span class="red">*</span>
                    </label>
                </div>
                <div class="right-select">
                    {{totalcasualtiesNum}}
                    <i class="iconfont icon-jinru rightmsg"
                       @click="getPeCasual()"></i>
                </div>

            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>填报单位
                        <span class="red">*</span>
                    </label>
                </div>
                <div>
                    <input type="text"
                           v-model="param.UnitName"
                           disabled/>
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>制表人
                        <span class="red">*</span>
                    </label>
                </div>
                <div>
                    <input type="text"
                           v-model="param.Linkman"
                           disabled/>
                </div>
            </div>
            <div class="form-item form-item-style1">
                <div class="label-title">
                    <label>联系电话
                        <span class="red">*</span>

                    </label>
                </div>
                <div>
                    <input type="text"
                           v-model="param.LinkTel" />
                </div>
            </div>
            <p class="search-btn"
               @click="sure"
               v-show="this.$route.query.urltype =='1'?false:true">提交</p>
        </div>
        <myMenu></myMenu>
    </div>
</template>
<script>
import upload from '@/commonComponents/upload/index'
import myMenu from '@/commonComponents/menu'
import { debuglog } from 'util'
export default {
    name: 'addCasualties',
    data () {
        return {
            list1: [],
            listold1: [],
            troublelevel: [],
            list2: [],
            troubletypedata: [],
            list3: [],
            listold3: [],
            reasondata: [],
            detailData: {},
            userInfo: '',
            isdisable: false,
            showSubmit: true,
            unfoldMeasure: false, // 展开
            totalcasualtiesNum: '', // 人员伤亡条数
            maxdate: '',
            param: {
                AccidentLevel: '', // 事故等级
                AccidentLevelName: '', // 事故等级名称
                AccidentMeasure: '', // 事故发生后采取的应急措施和其他情况
                AccidentName: '', // 事故名称
                AccidentPlace: '', // 事故发生地点
                AccidentReason: '', // 事故的经过和初步原因分析
                AccidentReasonCode: '', // 事故原因code
                AccidentReasonName: '', // 事故原因名称
                AccidentType: '', // 事故类别code
                AccidentTypeName: '', // 事故类别名称
                Address: '', // 地址
                BigNumber: '', // 重伤人数
                DieNumber: '', // 死亡人数
                LinkTel: '', // 联系电话
                Linkman: '', // 填报人
                ProjectId: '', // 单位ID
                ProjectName: '', // 单位名称
                SlightNumber: '', // 失踪人数
                UnitName: '', // 填报单位
                AccidentDate: '', // 事故发生时间
                simple: '', // 发生事故的项目建设单位、设计单位、监理单位的有关情况
                AccidentPerson: []
            }
        }
    },
    components: {
        myMenu
    },
    created () {
        this.maxdate = this.getdatenew()
        this.gettroubleReason()
        this.gettroubleLevel()
        this.getTroubType()
        this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
        this.param.AccidentDate = this.getdatenew()
        let noelist = JSON.parse(localStorage.getItem('nowaccpeptList'))
        this.param.ProjectName = this.userInfo.deptname
        this.param.ProjectId = this.userInfo.deptid
        this.param.LinkTel = this.userInfo.tel
        this.param.UnitName = this.userInfo.deptname
        this.param.Linkman = this.userInfo.username
        if (this.$store.state.checkcompany.sourceType !== 'addCasualties') {
            this.$store.state.checkcompany = {}
        }
        if (this.$route.query.urltype == '1') {
            this.isdisable = true
            this.getInfo()
            document.title = '人员伤亡详情'
        } else {
            if (localStorage.getItem('inputlist')) {
                let jsonpinput = JSON.parse(localStorage.getItem('inputlist'))
                this.param = jsonpinput
                this.troublelevel[0] = this.param.AccidentLevelName
                this.troubletypedata[0] = this.param.AccidentTypeName
                this.reasondata[0] = this.param.AccidentReasonName
                document.title = '添加人员伤亡'
            }
            this.isdisable = false
        }
    },
    methods: {

        // 事故原因
        gettroubleReason () {
            var that = this
            var params = {
                'allowPaging': true,
                'business': 'GetAccidentReason',
                'pageIndex': 0,
                'pageSize': 20,
                'tokenId': '1ED7B8A3DA7725CC45700551F09CF2AE',
                'userId': this.userInfo.userid
            }
            this.$axiosAjax.getConfigJson(params).then((res) => {
                let listArr = []
                let cateList = []
                if (res.data.code == 0) {
                    listArr = res.data.data
                    this.listold3 = listArr
                }
                listArr.forEach((item, index) => {
                    cateList.push(item.AccidentReasonName)
                })

                that.list3.push(cateList)
            }
            )
        },
        /// 事故等级
        gettroubleLevel () {
            var that = this
            var params = {
                'allowPaging': true,
                'business': 'GetAccidentLevel',
                'pageIndex': 0,
                'pageSize': 20,
                'tokenId': '1ED7B8A3DA7725CC45700551F09CF2AE',
                'userId': this.userInfo.userid

            }
            this.$axiosAjax.getConfigJson(params).then((res) => {
                // console.log(res)
                let listArr = []
                let cateList = []
                if (res.data.code == 0) {
                    listArr = res.data.data
                    this.listold1 = listArr
                }
                listArr.forEach((item, index) => {
                    cateList.push(item.AccidentLevelName)
                })

                that.list1.push(cateList)
            }
            )
        },
        getTroubType () {
            var that = this
            var params = {
                'allowPaging': true,
                'business': 'GetAccidentReportType',
                'pageIndex': 0,
                'pageSize': 20,
                'tokenId': '1ED7B8A3DA7725CC45700551F09CF2AE',
                'userId': this.userInfo.userid
            }
            this.$axiosAjax.getConfigJson(params).then((res) => {
                // console.log(res)
                let listArr = []
                let cateList = []
                if (res.data.code == 0) {
                    listArr = res.data.data
                    this.listold2 = listArr
                }
                listArr.forEach((item, index) => {
                    cateList.push(item.AccidentTypeName)
                })

                that.list2.push(cateList)
            }
            )
        },

        setFormData (formData, uploadLength) {
            this.uploadImgFormData = formData
            this.uploadLength = uploadLength
        },

        getdatenew () {
            var date = new Date()
            var seperator1 = '-'
            var year = date.getFullYear()
            var month = date.getMonth() + 1
            var strDate = date.getDate()
            if (month >= 1 && month <= 9) {
                month = '0' + month
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = '0' + strDate
            }
            var currentdate = year + seperator1 + month + seperator1 + strDate
            return currentdate
        },
        sure () { // 提交数据
            if (!this.param.Address) {
                this.$vux.toast.text('请输入地址')
                return false
            }
            if (!this.param.AccidentName) {
                this.$vux.toast.text('请输入事故名称')
                return false
            }
            if (!this.param.AccidentPlace) {
                this.$vux.toast.text('请输入事故发生地点')
                return false
            }
            if (!this.param.DieNumber) {
                this.$vux.toast.text('请输入死亡人数')
                return false
            }
            if (!this.param.BigNumber) {
                this.$vux.toast.text('请输入重伤人数')
                return false
            }
            if (!this.param.SlightNumber) {
                this.$vux.toast.text('请输入失踪人数')
                return false
            }
            if (!this.param.AccidentReason) {
                this.$vux.toast.text('请输入事物的经过和初步原因分析')
                return false
            }
            if (!this.param.simple) {
                this.$vux.toast.text('请输入发生事故的相关情况')
                return false
            }

            this.getselectCode()

            if (!this.param.AccidentReasonCode) {
                this.$vux.toast.text('请选择事故原因')
                return false
            }
            if (!this.param.AccidentType) {
                this.$vux.toast.text('请选择事故类别')
                return false
            }
            if (!this.param.AccidentLevel) {
                this.$vux.toast.text('请选择事故等级')
                return false
            }
            var params = {
                'allowPaging': true,
                'business': 'SubmitAccidentReport',
                'data': this.param,
                'pageIndex': 0,
                'pageSize': 20,
                'tokenId': '1ED7B8A3DA7725CC45700551F09CF2AE',
                'userId': this.userInfo.userid,
                'method': 'submit'
            }
            this.$axiosAjax.getConfigJson(params).then((res) => {
                // 新增成功
                this.$store.state.personCasualtiesList = []
                localStorage.removeItem('inputlist')
                this.$router.push('./AccidentReport')
            }
            )
        },
        getselectCode () {
            this.param.AccidentPerson = this.$store.state.personCasualtiesList
            this.param.AccidentReasonName = this.reasondata[0]// 事故原因
            // 根据事故原因查code
            this.listold3.forEach(res => {
                if (res.AccidentReasonName == this.reasondata[0]) {
                    this.param.AccidentReasonCode = res.AccidentReasonCode
                }
            })

            this.param.AccidentTypeName = this.troubletypedata[0]// 事故类别
            // 根据事故类别名称查code
            this.listold2.forEach(res => {
                if (res.AccidentTypeName == this.troubletypedata[0]) {
                    this.param.AccidentType = res.AccidentType
                }
            })
            this.param.AccidentLevel = this.troublelevel[0]// 事故等级

            // 根据事故等级
            this.listold1.forEach(res => {
                if (res.AccidentLevelName == this.troublelevel[0]) {
                    this.param.AccidentLevel = res.AccidentLevelName
                }
            })
        },
        getInfo () {
            let params = {
                'allowPaging': false,
                'business': 'GetAccidentReportList',
                'data': {
                    'AccidentType': '',
                    'EndDate': '',
                    'ProjectID': '',
                    'StartDate': '',
                    'id': this.$route.query.id
                },
                'pageIndex': 0,
                'pageSize': 10000,
                'tokenId': '',
                'userId': this.userInfo.userid
            }
            this.$axiosAjax.getConfigJson(params)
                .then((res) => {
                    if (res.data.code == 0) {
                        this.acceptList = res.data.data
                        let id = this.$route.query.id
                        this.acceptList.forEach((item, index) => {
                            if (item.ID == id) {
                                this.param = item
                                this.totalcasualtiesNum = item.AccidentPerson.length == 0 ? '' : item.AccidentPerson.length
                            }
                        })
                    } else {
                        this.$vux.toast.text(res.data.info)
                    }
                }).catch(() => {

                })
        },
        getPeCasual () {
            // 点击时：记录当前页面输入的值
            this.getInputStore()
            let ty = this.$route.query.urltype
            let id = this.$route.query.id
            this.$router.push({ path: 'CasualtiesList', query: { urltype: ty, id: id } })
        },
        getInputStore () // 点击时：记录当前页面输入的值
        {
            this.getselectCode()
            localStorage.removeItem('inputlist')
            let par = {
                AccidentLevel: this.param.AccidentLevel, // 事故等级
                AccidentLevelName: this.troublelevel[0], // 事故等级名称
                AccidentMeasure: this.param.AccidentMeasure, // 事故发生后采取的应急措施和其他情况
                AccidentName: this.param.AccidentName, // 事故名称
                AccidentPlace: this.param.AccidentPlace, // 事故发生地点
                AccidentReason: this.param.AccidentReason, // 事故的经过和初步原因分析
                AccidentReasonCode: this.param.AccidentReasonCode, // 事故原因code
                AccidentReasonName: this.reasondata[0], // 事故原因名称
                AccidentType: this.param.AccidentType, // 事故类别code
                AccidentTypeName: this.troubletypedata[0], // 事故类别名称
                Address: this.param.Address, // 地址
                BigNumber: this.param.BigNumber, // 重伤人数
                DieNumber: this.param.DieNumber, // 死亡人数
                LinkTel: this.param.LinkTel, // 联系电话
                Linkman: this.param.Linkman, // 填报人
                SlightNumber: this.param.SlightNumber, // 失踪人数
                UnitName: this.param.UnitName, // 填报单位
                AccidentDate: this.param.AccidentDate, // 事故发生时间
                simple: this.param.simple, // 发生事故的项目建设单位、设计单位、监理单位的有关情况
                ProjectId: this.param.ProjectId, // 单位ID
                ProjectName: this.param.ProjectName// 单位名称

            }
            let jsonpinput = JSON.stringify(par)
            localStorage.setItem('inputlist', jsonpinput)
        }
    }
}
</script>
<style scoped>
.red {
    color: red;
}
input {
    text-align: right;
    font-size: 12px;
}
.search-btn {
    width: 200px;
    line-height: 40px;
    border-radius: 20px;
    margin: 23px auto;
    text-align: center;
    color: #fff;
    background: #2269ff;
}
.search-btn:hover {
    opacity: 8;
}

.select-section {
    display: flex;
}
.select-section div {
    padding-left: 26px;
    background: url(../../../../static/images/select.png) no-repeat left center;
    background-size: 17px 17px;
}
.select-section div:first-child {
    margin-right: 58px;
}
.select-section .active {
    background: url(../../../../static/images/selected.png) no-repeat left
        center;
    background-size: 17px 17px;
}
.form-item input[disabled] {
    background-color: #fff;
}
</style>
